-

In the Template selection window or in the Custom Template window: choose either a Vertical menu if you want the fixed navigation menu the first lefthand column of the page, or Horizontal menu for horizontal fixed navigation.

-

In the Sitemap Creation window: create the website's tree structure, adding levels and pages. The tree structure has various levels of indentation: first-level items correspond to the items in the fixed navigation menu: the items in the other levels are used for local navigation.

Button labels (the names on the button) are a crucial factor in determining the quality of a website's navigation structure. The names you choose must be clear and comprehensible: prefer common names used in other sites rather than new names which could cause confusion.

In WebSite X5 the labels on the menu buttons correspond to the names given to levels and pages when creating the website Map (see Sitemap Creation). These names are automatically used for the page titles and the names of the HTML files of the pages. Use the options in the Page Properties window to change the title and file name for a page. In this way, you can diversify texts to define adequate menu button labeling and give titles to improve both the comprehension of the text and search engine indexing.

Usability tests show that menus are not always the main way visitors access information on a website. Often, when we visit new sites, we tend to use the links we find in the pages to move around, rather than select a page from the menus.

Briefly, the text to be used as a link must be concise, explanatory and make sense out of context.

§Meaningless text

Links must maintain their meaning even when they are out of context: expressions such as "click here", "more information", "info", which are superfluous when they start a sentence, are to be avoided. A mere "click here" gives no information on what information is going to follow the link: it has little meaning both for visitors and for search engines, that often use these texts to judge the link's relevance.

§Length of links

It's difficult to say how long the text of a link should be. Generally speaking, it should be long enough to express what it's for: it must be as concise as possible, without losing its meaning.

§URLs in links

Sometimes it is useful to use a URL as a link (for example, http://www.mywebsite.com). Remember, though, that not all URLs are significant and they are also often quite long. It may be better to change the text of a link, to make it more meaningful.

§Alternative text for linked images

When an image is used as a link, the alternative (ALT) text has the same function as the text of a hypertext link. When you write alternative text for an image, remember that you don't have to specify that it is a link, and the aim of the ALT text is not to describe an image but to provide text content that adequately replaces it. So if you have a picture of a button with the word "Products" on it, the alternative text could simply be "Products".

Another factor that influences the quality of your navigation structure is the aspect of the links, their design.

§Underlining

A visitor must be able to instantly recognize the links in a page: it is very frustrating to click on text that you think is a link, and then nothing happens, or move the mouse haphazardly around the page, hoping it will change to a little hand, but never does.

By default, browsers underline all the links: you can remove this, but you shouldn't do in most cases. Underling links has become a recognized standard, and only in main menu items is it not so often used. Using color to distinguish links is not a good idea, because it reduces your website's accessibility: colored links don't show up on a gray-scale monitor or on a page printed in B/W, and color-blind people will not see them.

§Colors

Browsers usually show unvisited links in blue and visited links in red: it will make your website navigation a more pleasant experience if you adhere to the conventions. You can, however, suggest different colors, but remember to respect the contrast between foreground and background, and be coherent with the use of the colors for visited and unvisited links.

§Hover and Focus effects

Many sites use special effects for different states of links. This is certainly positive in terms of site accessibility, as it helps the visitor understand which link is being focused on.

WebSite X5 lets you customize the aspect of both the buttons in the navigation menus and the hypertext links in the pages:

§In the Step 4 - Advanced Settings section you will find the windows for working on menu styles  (see Main Menu Style, Drop Down Menu Style and Page Menu Style) and, with the built-in editor, you can obtain 3D buttons with mouseover effects.

§The options for changing the style of hypertext links can be found in the Step 4 - Advanced Settings section, in the Styles and Models window.

A good-quality site will always tell the visitor what to expect when he follows a link.

§Links to non-HTML resources

Visitors should be warned if a link opens a resource that is not a website page, such as a PDF, Word or PowerPoint file, etc. Browsers do not give this information, so it is up to the author to indicate what type of file will be opened.

§Links to new windows, popups or other websites

Visitors should be warned if a link will open a new window or a popup: without a warning, visitors could be confused as to where they are, without realizing they are in a new window, and have difficulty returning to where they started from. Again, it up to the site author to provide adequate information, such as "opens in a new window".

WebSite X5 lets you set up links in text and images, so you can include a description for each link.

To define the content and style of Tooltips, see the Description section in the Link window.

As well as links in the navigation menus and in the pages, WebSite X5 also automatically creates and adds links and anchors that remain invisible during normal navigation with the browser.

We are talking about skip links, that are added in strategic parts of the page so that visitors can move freely around the contents without using navigation links, or to go to the navigation links, bypassing the contents. Skip links aren't displayed by visual browsers. They are, however, visible when stylesheets are disabled.

If skip links are used, after the site title, the first-level items of the navigation menu are displayed: the main page contents follow, with submenus, notes and links to footnotes. A page organization of this type is thought to highlight the contents, so improving search engine indexing and better usability on mobile devices.

Starting from the structure defined in the Sitemap Creation, WebSite X5 creates and links the linked website Map to the code of the pages: the website Map is also used by search engines for indexing. This Map can be useful for visitors to find their way around a site: the link to display is added automatically at the bottom of the page (see Styles and Models ) and/or it can be created in the Link window.